<template>
  <el-dialog
    v-model="visible"
    v-if="load"
    title="开发审核"
    width="600"
    draggable
    @close="close"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :z-index="2000"
  >
    <template #default>
      <el-form
        ref="formRef"
        :model="form"
        :rules="rules"
        label-width="80"
        label-position="top"
      >
        <el-form-item label="审核">
          <el-radio-group v-model="form.reviewOpinion">
            <el-radio :label="true">审核通过</el-radio>
            <el-radio :label="false">审核未通过</el-radio>
          </el-radio-group>
        </el-form-item>
        <div class="flex items-center">
          <el-checkbox
            v-model="form.is_custom_notice"
            :true-label="1"
            :false-label="0"
            label="自定义人员通知"
            size="large"
          />
          <select-personnel
            class="w-60 ml-2"
            v-model="form.manage_user_id"
            placeholder="自定义通知人员"
          ></select-personnel>
        </div>
        <el-form-item label="审核备注">
          <el-input
            v-model="form.reviewRemark"
            placeholder="请输入"
            :autosize="{ minRows: 4, maxRows: 10 }"
            type="textarea"
          />
        </el-form-item>
      </el-form>
    </template>
    <template #footer>
      <el-button @click="close">取 消</el-button>
      <el-button type="primary" :loading="loading" @click="save(formRef)"
        >保 存</el-button
      >
    </template>
  </el-dialog>
</template>
<script setup name="AuditModal">
import { review, getManageUser } from "../api";
import { reactive, toRefs, getCurrentInstance } from "vue";
import { ElMessage } from "element-plus";
const { proxy } = getCurrentInstance();
const emits = defineEmits(["query"]);
const data = reactive({
  form: {},
  visible: false,
  loading: false,
  formRef: null,
  options: [],
  rules: {
    name: [{ required: true, message: "请输入属性名" }],
  },
  load: false,
});
const { rules, form, visible, loading, formRef, options, load } = toRefs(data);
const open = async (data) => {
  if (!load.value) {
    load.value = true;
    await 1;
  }
  if (data) form.value = data;
  form.value.is_custom_notice = 0;

  const is_flag =
    data.spu_category.every((i) => i[0] === 148) ||
    data.spu_category.every((i) => i[0] === 224);
  if (is_flag) {
    getUser(data.developer_ids[0]);
  }
  visible.value = true;
};
const save = () => {
  if (!formRef.value) return;
  formRef.value.validate((valid) => {
    if (valid) {
      loading.value = true;
      review(form.value)
        .then((res) => {
          ElMessage.success(res.message);
          emits("query");
          close();
        })
        .finally(() => {
          loading.value = false;
        });
    }
  });
};
const close = () => {
  proxy.resetForm("formRef");
  visible.value = false;
};
defineExpose({ open });

const getUser = (user_id) => {
  getManageUser({
    user_id: Number(user_id),
  }).then((res) => {
    form.value.manage_user_id = res.data[0];
    if (form.value.manage_user_id) {
      form.value.is_custom_notice = 1;
    }
  });
};
</script>
